<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>scripty2 API documentation | S2.FX.Element class</title>
    <link type="text/css" charset="utf-8" rel="stylesheet" media="screen, projection" href="../../../stylesheets/apidocs.css" />
  </head>
  <body>
    <div id="page">

      <div id="masthead">
        <div id="masthead_content">
          <a href="../../../">
            <h1 id="logo"><span class="replaced">scripty2</span></h1>
          </a>
          <div id="menu" class="clearfix">
            <div class="search-box">
              <form action="" method="get">
                <label><span class="hidden">Search </span><input type="text" id="search" size="20" /></label>
              </form>
              <ul id="search_results" class="search-results menu-items" style="display:none"><li></li></ul>
            </div>
            <div class="api-box">
              <h2><a href="#" id="api_menu_button">Quick Links &darr;</a></h2>
              <ul id="api_menu" class="menu-items" style="display: none">
                
                  <li>              <div class='menu-item'>
                <a class="section" href="../../../scripty2_core_section.html" title="scripty2 core section (section)">scripty2 core section</a>
              </div>
<ul><li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 core/function.html" title="Function (class)">Function</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 core/number.html" title="Number (class)">Number</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 core/object.html" title="Object (class)">Object</a>
              </div>
</li>
<li class="current-parent">              <div class='menu-item'>
                <a class="namespace" href="../../../scripty2 core/s2.html" title="S2 (namespace)">S2</a>
              </div>
<ul><li>              <div class='menu-item'>
                <a class="namespace" href="../../../scripty2 ui/s2/css.html" title="S2.CSS (namespace)">S2.CSS</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="namespace" href="../../../scripty2 core/s2/extensions.html" title="S2.Extensions (namespace)">S2.Extensions</a>
              </div>
</li>
<li class="current-parent">              <div class='menu-item'>
                <a class="namespace" href="../../../scripty2 fx/s2/fx.html" title="S2.FX (namespace)">S2.FX</a>
              </div>
<ul><li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 fx/s2/fx/attribute.html" title="S2.FX.Attribute (class)">S2.FX.Attribute</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 fx/s2/fx/base.html" title="S2.FX.Base (class)">S2.FX.Base</a>
              </div>
</li>
<li class="current">              <div class='menu-item'>
                <a class="class" href="../../../scripty2 fx/s2/fx/element.html" title="S2.FX.Element (class)">S2.FX.Element</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 fx/s2/fx/heartbeat.html" title="S2.FX.Heartbeat (class)">S2.FX.Heartbeat</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 fx/s2/fx/morph.html" title="S2.FX.Morph (class)">S2.FX.Morph</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="namespace" href="../../../scripty2 fx/s2/fx/operators.html" title="S2.FX.Operators (namespace)">S2.FX.Operators</a>
              </div>
<ul><li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 fx/s2/fx/operators/base.html" title="S2.FX.Operators.Base (class)">S2.FX.Operators.Base</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 fx/s2/fx/operators/scroll.html" title="S2.FX.Operators.Scroll (class)">S2.FX.Operators.Scroll</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 fx/s2/fx/operators/style.html" title="S2.FX.Operators.Style (class)">S2.FX.Operators.Style</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 fx/s2/fx/operators/webkitcsstransition.html" title="S2.FX.Operators.WebkitCssTransition (class)">S2.FX.Operators.WebkitCssTransition</a>
              </div>
</li></ul></li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 fx/s2/fx/parallel.html" title="S2.FX.Parallel (class)">S2.FX.Parallel</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 fx/s2/fx/queue.html" title="S2.FX.Queue (class)">S2.FX.Queue</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 fx/s2/fx/scroll.html" title="S2.FX.Scroll (class)">S2.FX.Scroll</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 fx/s2/fx/style.html" title="S2.FX.Style (class)">S2.FX.Style</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="namespace" href="../../../scripty2 fx/s2/fx/transitions.html" title="S2.FX.Transitions (namespace)">S2.FX.Transitions</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 fx/s2/fx/operators/base.html" title="S2.FX.Operators.Base (class)">S2.FX.Operators.Base</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 fx/s2/fx/operators/scroll.html" title="S2.FX.Operators.Scroll (class)">S2.FX.Operators.Scroll</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 fx/s2/fx/operators/style.html" title="S2.FX.Operators.Style (class)">S2.FX.Operators.Style</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 fx/s2/fx/operators/webkitcsstransition.html" title="S2.FX.Operators.WebkitCssTransition (class)">S2.FX.Operators.WebkitCssTransition</a>
              </div>
</li></ul></li>
<li>              <div class='menu-item'>
                <a class="namespace" href="../../../scripty2 ui/s2/ui.html" title="S2.UI (namespace)">S2.UI</a>
              </div>
<ul><li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 ui/s2/ui/accordion.html" title="S2.UI.Accordion (class)">S2.UI.Accordion</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 ui/s2/ui/autocompleter.html" title="S2.UI.Autocompleter (class)">S2.UI.Autocompleter</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 ui/s2/ui/base.html" title="S2.UI.Base (class)">S2.UI.Base</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 ui/s2/ui/behavior.html" title="S2.UI.Behavior (class)">S2.UI.Behavior</a>
              </div>
<ul><li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 ui/s2/ui/behavior/down.html" title="S2.UI.Behavior.Down (class)">S2.UI.Behavior.Down</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 ui/s2/ui/behavior/drag.html" title="S2.UI.Behavior.Drag (class)">S2.UI.Behavior.Drag</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 ui/s2/ui/behavior/focus.html" title="S2.UI.Behavior.Focus (class)">S2.UI.Behavior.Focus</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 ui/s2/ui/behavior/hover.html" title="S2.UI.Behavior.Hover (class)">S2.UI.Behavior.Hover</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 ui/s2/ui/behavior/resize.html" title="S2.UI.Behavior.Resize (class)">S2.UI.Behavior.Resize</a>
              </div>
</li></ul></li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 ui/s2/ui/button.html" title="S2.UI.Button (class)">S2.UI.Button</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 ui/s2/ui/dialog.html" title="S2.UI.Dialog (class)">S2.UI.Dialog</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 ui/s2/ui/menu.html" title="S2.UI.Menu (class)">S2.UI.Menu</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="namespace" href="../../../scripty2 ui/s2/ui/mixin.html" title="S2.UI.Mixin (namespace)">S2.UI.Mixin</a>
              </div>
<ul><li>              <div class='menu-item'>
                <a class="mixin" href="../../../scripty2 ui/s2/ui/mixin/configurable.html" title="S2.UI.Mixin.Configurable (mixin)">S2.UI.Mixin.Configurable</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="mixin" href="../../../scripty2 ui/s2/ui/mixin/shim.html" title="S2.UI.Mixin.Shim (mixin)">S2.UI.Mixin.Shim</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="mixin" href="../../../scripty2 ui/s2/ui/mixin/trackable.html" title="S2.UI.Mixin.Trackable (mixin)">S2.UI.Mixin.Trackable</a>
              </div>
</li></ul></li>
<li>              <div class='menu-item'>
                <a class="namespace" href="../../../scripty2 ui/s2/ui/multitouch.html" title="S2.UI.Multitouch (namespace)">S2.UI.Multitouch</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 ui/s2/ui/overlay.html" title="S2.UI.Overlay (class)">S2.UI.Overlay</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 ui/s2/ui/progressbar.html" title="S2.UI.ProgressBar (class)">S2.UI.ProgressBar</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 ui/s2/ui/slider.html" title="S2.UI.Slider (class)">S2.UI.Slider</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 ui/s2/ui/tabs.html" title="S2.UI.Tabs (class)">S2.UI.Tabs</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 ui/s2/ui/behavior/down.html" title="S2.UI.Behavior.Down (class)">S2.UI.Behavior.Down</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 ui/s2/ui/behavior/drag.html" title="S2.UI.Behavior.Drag (class)">S2.UI.Behavior.Drag</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 ui/s2/ui/behavior/focus.html" title="S2.UI.Behavior.Focus (class)">S2.UI.Behavior.Focus</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 ui/s2/ui/behavior/hover.html" title="S2.UI.Behavior.Hover (class)">S2.UI.Behavior.Hover</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 ui/s2/ui/behavior/resize.html" title="S2.UI.Behavior.Resize (class)">S2.UI.Behavior.Resize</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="mixin" href="../../../scripty2 ui/s2/ui/mixin/configurable.html" title="S2.UI.Mixin.Configurable (mixin)">S2.UI.Mixin.Configurable</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="mixin" href="../../../scripty2 ui/s2/ui/mixin/shim.html" title="S2.UI.Mixin.Shim (mixin)">S2.UI.Mixin.Shim</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="mixin" href="../../../scripty2 ui/s2/ui/mixin/trackable.html" title="S2.UI.Mixin.Trackable (mixin)">S2.UI.Mixin.Trackable</a>
              </div>
</li></ul></li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 fx/s2/fx/attribute.html" title="S2.FX.Attribute (class)">S2.FX.Attribute</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 fx/s2/fx/base.html" title="S2.FX.Base (class)">S2.FX.Base</a>
              </div>
</li>
<li class="current">              <div class='menu-item'>
                <a class="class" href="../../../scripty2 fx/s2/fx/element.html" title="S2.FX.Element (class)">S2.FX.Element</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 fx/s2/fx/heartbeat.html" title="S2.FX.Heartbeat (class)">S2.FX.Heartbeat</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 fx/s2/fx/morph.html" title="S2.FX.Morph (class)">S2.FX.Morph</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="namespace" href="../../../scripty2 fx/s2/fx/operators.html" title="S2.FX.Operators (namespace)">S2.FX.Operators</a>
              </div>
<ul><li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 fx/s2/fx/operators/base.html" title="S2.FX.Operators.Base (class)">S2.FX.Operators.Base</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 fx/s2/fx/operators/scroll.html" title="S2.FX.Operators.Scroll (class)">S2.FX.Operators.Scroll</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 fx/s2/fx/operators/style.html" title="S2.FX.Operators.Style (class)">S2.FX.Operators.Style</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 fx/s2/fx/operators/webkitcsstransition.html" title="S2.FX.Operators.WebkitCssTransition (class)">S2.FX.Operators.WebkitCssTransition</a>
              </div>
</li></ul></li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 fx/s2/fx/parallel.html" title="S2.FX.Parallel (class)">S2.FX.Parallel</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 fx/s2/fx/queue.html" title="S2.FX.Queue (class)">S2.FX.Queue</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 fx/s2/fx/scroll.html" title="S2.FX.Scroll (class)">S2.FX.Scroll</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 fx/s2/fx/style.html" title="S2.FX.Style (class)">S2.FX.Style</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="namespace" href="../../../scripty2 fx/s2/fx/transitions.html" title="S2.FX.Transitions (namespace)">S2.FX.Transitions</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 fx/s2/fx/operators/base.html" title="S2.FX.Operators.Base (class)">S2.FX.Operators.Base</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 fx/s2/fx/operators/scroll.html" title="S2.FX.Operators.Scroll (class)">S2.FX.Operators.Scroll</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 fx/s2/fx/operators/style.html" title="S2.FX.Operators.Style (class)">S2.FX.Operators.Style</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 fx/s2/fx/operators/webkitcsstransition.html" title="S2.FX.Operators.WebkitCssTransition (class)">S2.FX.Operators.WebkitCssTransition</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 ui/s2/ui/accordion.html" title="S2.UI.Accordion (class)">S2.UI.Accordion</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 ui/s2/ui/autocompleter.html" title="S2.UI.Autocompleter (class)">S2.UI.Autocompleter</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 ui/s2/ui/base.html" title="S2.UI.Base (class)">S2.UI.Base</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 ui/s2/ui/behavior.html" title="S2.UI.Behavior (class)">S2.UI.Behavior</a>
              </div>
<ul><li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 ui/s2/ui/behavior/down.html" title="S2.UI.Behavior.Down (class)">S2.UI.Behavior.Down</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 ui/s2/ui/behavior/drag.html" title="S2.UI.Behavior.Drag (class)">S2.UI.Behavior.Drag</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 ui/s2/ui/behavior/focus.html" title="S2.UI.Behavior.Focus (class)">S2.UI.Behavior.Focus</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 ui/s2/ui/behavior/hover.html" title="S2.UI.Behavior.Hover (class)">S2.UI.Behavior.Hover</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 ui/s2/ui/behavior/resize.html" title="S2.UI.Behavior.Resize (class)">S2.UI.Behavior.Resize</a>
              </div>
</li></ul></li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 ui/s2/ui/button.html" title="S2.UI.Button (class)">S2.UI.Button</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 ui/s2/ui/dialog.html" title="S2.UI.Dialog (class)">S2.UI.Dialog</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 ui/s2/ui/menu.html" title="S2.UI.Menu (class)">S2.UI.Menu</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="namespace" href="../../../scripty2 ui/s2/ui/mixin.html" title="S2.UI.Mixin (namespace)">S2.UI.Mixin</a>
              </div>
<ul><li>              <div class='menu-item'>
                <a class="mixin" href="../../../scripty2 ui/s2/ui/mixin/configurable.html" title="S2.UI.Mixin.Configurable (mixin)">S2.UI.Mixin.Configurable</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="mixin" href="../../../scripty2 ui/s2/ui/mixin/shim.html" title="S2.UI.Mixin.Shim (mixin)">S2.UI.Mixin.Shim</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="mixin" href="../../../scripty2 ui/s2/ui/mixin/trackable.html" title="S2.UI.Mixin.Trackable (mixin)">S2.UI.Mixin.Trackable</a>
              </div>
</li></ul></li>
<li>              <div class='menu-item'>
                <a class="namespace" href="../../../scripty2 ui/s2/ui/multitouch.html" title="S2.UI.Multitouch (namespace)">S2.UI.Multitouch</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 ui/s2/ui/overlay.html" title="S2.UI.Overlay (class)">S2.UI.Overlay</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 ui/s2/ui/progressbar.html" title="S2.UI.ProgressBar (class)">S2.UI.ProgressBar</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 ui/s2/ui/slider.html" title="S2.UI.Slider (class)">S2.UI.Slider</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 ui/s2/ui/tabs.html" title="S2.UI.Tabs (class)">S2.UI.Tabs</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 ui/s2/ui/behavior/down.html" title="S2.UI.Behavior.Down (class)">S2.UI.Behavior.Down</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 ui/s2/ui/behavior/drag.html" title="S2.UI.Behavior.Drag (class)">S2.UI.Behavior.Drag</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 ui/s2/ui/behavior/focus.html" title="S2.UI.Behavior.Focus (class)">S2.UI.Behavior.Focus</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 ui/s2/ui/behavior/hover.html" title="S2.UI.Behavior.Hover (class)">S2.UI.Behavior.Hover</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 ui/s2/ui/behavior/resize.html" title="S2.UI.Behavior.Resize (class)">S2.UI.Behavior.Resize</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="mixin" href="../../../scripty2 ui/s2/ui/mixin/configurable.html" title="S2.UI.Mixin.Configurable (mixin)">S2.UI.Mixin.Configurable</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="mixin" href="../../../scripty2 ui/s2/ui/mixin/shim.html" title="S2.UI.Mixin.Shim (mixin)">S2.UI.Mixin.Shim</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="mixin" href="../../../scripty2 ui/s2/ui/mixin/trackable.html" title="S2.UI.Mixin.Trackable (mixin)">S2.UI.Mixin.Trackable</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 fx/s2/fx/operators/base.html" title="S2.FX.Operators.Base (class)">S2.FX.Operators.Base</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 fx/s2/fx/operators/scroll.html" title="S2.FX.Operators.Scroll (class)">S2.FX.Operators.Scroll</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 fx/s2/fx/operators/style.html" title="S2.FX.Operators.Style (class)">S2.FX.Operators.Style</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 fx/s2/fx/operators/webkitcsstransition.html" title="S2.FX.Operators.WebkitCssTransition (class)">S2.FX.Operators.WebkitCssTransition</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 ui/s2/ui/behavior/down.html" title="S2.UI.Behavior.Down (class)">S2.UI.Behavior.Down</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 ui/s2/ui/behavior/drag.html" title="S2.UI.Behavior.Drag (class)">S2.UI.Behavior.Drag</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 ui/s2/ui/behavior/focus.html" title="S2.UI.Behavior.Focus (class)">S2.UI.Behavior.Focus</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 ui/s2/ui/behavior/hover.html" title="S2.UI.Behavior.Hover (class)">S2.UI.Behavior.Hover</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 ui/s2/ui/behavior/resize.html" title="S2.UI.Behavior.Resize (class)">S2.UI.Behavior.Resize</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="mixin" href="../../../scripty2 ui/s2/ui/mixin/configurable.html" title="S2.UI.Mixin.Configurable (mixin)">S2.UI.Mixin.Configurable</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="mixin" href="../../../scripty2 ui/s2/ui/mixin/shim.html" title="S2.UI.Mixin.Shim (mixin)">S2.UI.Mixin.Shim</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="mixin" href="../../../scripty2 ui/s2/ui/mixin/trackable.html" title="S2.UI.Mixin.Trackable (mixin)">S2.UI.Mixin.Trackable</a>
              </div>
</li></ul></li></ul></li>
                
                  <li class="current-parent">              <div class='menu-item'>
                <a class="section" href="../../../scripty2_fx_section.html" title="scripty2 fx section (section)">scripty2 fx section</a>
              </div>
<ul><li>              <div class='menu-item'>
                <a class="namespace" href="../../../scripty2 fx/element.html" title="Element (namespace)">Element</a>
              </div>
<ul><li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 fx/element/layout.html" title="Element.Layout (class)">Element.Layout</a>
              </div>
</li>
<li>              <div class='menu-item'>
                <a class="class" href="../../../scripty2 fx/element/offset.html" title="Element.Offset (class)">Element.Offset</a>
              </div>
</li></ul></li></ul></li>
                
                  <li>              <div class='menu-item'>
                <a class="section" href="../../../scripty2_ui_section.html" title="scripty2 ui section (section)">scripty2 ui section</a>
              </div>
</li>
                
              </ul>
            </div>
          </div>
        </div>
      </div>

      <div id="main" class="page-content">
        

<ul class="breadcrumbs clearfix">
  <li><a href="../../../index.html">Home</a> &rarr;</li>
  
  <li><a href="../../../scripty2_fx_section.html">scripty2 fx</a> &rarr;</li>
  
</ul>

<h2 class="page-title class">
  <span class="type">class </span>S2.FX.Element
</h2>


<div class="section section-description">
  <div class="section-title">
    <h3>Description</h3>
  </div>
  <div class="section-content">
    <p>Base class for effects that change DOM elements. This is the base class for
the most important effects implementation <code><a href="../../../scripty2 fx/s2/fx/morph.html" title="S2.FX.Morph (class)">S2.FX.Morph</a></code>, but can be used
as a base class for non-CSS based effects too.</p>
  </div>
</div>



  
  <div class="section section-superclass">
    <div class="section-title">
      <h3>Superclass</h3>
    </div>
    <div class="section-content">
      <p><code><a href="../../../scripty2 fx/s2/fx/base.html" title="S2.FX.Base (class)">S2.FX.Base</a></code></p>
    </div>
  </div>
  

  
  <div class="section section-subclasses">
    <div class="section-title">
      <h3>Subclasses</h3>
    </div>
    <div class="section-content">
      <p><code><a href="../../../scripty2 fx/s2/fx/style.html" title="S2.FX.Style (class)">S2.FX.Style</a></code>, <code><a href="../../../scripty2 fx/s2/fx/morph.html" title="S2.FX.Morph (class)">S2.FX.Morph</a></code>, <code><a href="../../../scripty2 fx/s2/fx/scroll.html" title="S2.FX.Scroll (class)">S2.FX.Scroll</a></code></p>
    </div>
  </div>
  







<div class="section section-method-list">
  <div class="section-title">
    <h3>Methods</h3>
  </div>
  <div class="section-content">
    <ul class="method-list">
      
        <li><code><a class="instance-method" href="../../../scripty2 fx/s2/fx/element.html#animate-instance_method" title="S2.FX.Element#animate (instance method)">animate</a></code></li>
      
        <li><code><a class="constructor" href="../../../scripty2 fx/s2/fx/element.html#new-constructor" title="new S2.FX.Element (constructor)">new</a></code></li>
      
        <li><code><a class="instance-method" href="../../../scripty2 fx/s2/fx/element.html#play-instance_method" title="S2.FX.Element#play (instance method)">play</a></code></li>
      
    </ul>
    
  </div>
</div>



<div class="section section-constructor">
  <div class="section-title">
    <h3>Constructor</h3>
  </div>
  <div class="section-content">
    <pre id="new-constructor" class="syntax"><code>new S2.FX.Element(element[, options])</code></pre>
    
      <ul class="argument-list">
        
          <li>
            <code>element</code>
            
              (<code><a href="../../../scripty2 core/object.html" title="Object (class)">Object</a></code> | <code>String</code>)
            
             &ndash; DOM element or element ID
          </li>
        
          <li>
            <code>options</code>
            
              (<code><a href="../../../scripty2 core/number.html" title="Number (class)">Number</a></code> | <code><a href="../../../scripty2 core/function.html" title="Function (class)">Function</a></code> | <code><a href="../../../scripty2 core/object.html" title="Object (class)">Object</a></code>)
            
             &ndash; options for the effect.
          </li>
        
      </ul>
    
    <p><p>See <code><a href="../../../scripty2 fx/s2/fx/base.html" title="S2.FX.Base (class)">S2.FX.Base</a></code> for a description of the <code>options</code> argument.</p></p>
  </div>
</div>





  
  

  
  

  
  

  
  

  
  
    <div class="section section-instance_methods">
      <div class="section-title">
        <h3>Instance methods</h3>
      </div>
      <div class="section-content">
        <ul class="method-details-list">
          <li class="method-description">
  <h4 id="animate-instance_method">animate
    <span class="method-permalink"><a href="../../../scripty2 fx/s2/fx/element.html#animate-instance_method">#</a></span></h4>

  
                  <pre class="syntax"><code class="ebnf">S2.FX.Element#animate(operator[, args...]) -&gt; undefined</code></pre>

  
  
  
    
      <ul class="argument-list">
        
          <li>
            <code>operator</code>
            
              (<code>String</code>)
            
             &ndash; lowercase name of an S2.FX.Operator
          </li>
        
      </ul>
    
  
  
  <p>Starts an animation by using a S2.FX.Operator on the element
that is associated with the effect.</p>

<p>The rest of the arguments are passed to Operators' constructor.
This method is intended to be called in the <code>setup</code> instance method
of subclasses, for example:<div class="CodeRay">
  <div class="code"><pre><span style="color:#888">// setup method from S2.FX.Style</span>
setup: <span style="color:#080;font-weight:bold">function</span>() {
  <span style="color:#963">this</span>.animate(<span style="background-color:#fff0f0;color:#D20"><span style="color:#710">'</span><span style="">style</span><span style="color:#710">'</span></span>, <span style="color:#963">this</span>.element, { <span style="color:#808">style</span>: <span style="color:#963">this</span>.options.style });
}</pre></div>
</div></p>

  
  
  
  
</li>

<li class="method-description">
  <h4 id="play-instance_method">play
    <span class="method-permalink"><a href="../../../scripty2 fx/s2/fx/element.html#play-instance_method">#</a></span></h4>

  
                  <pre class="syntax"><code class="ebnf">S2.FX.Element#play([element[, options]]) -&gt; <a href="../../../scripty2 fx/s2/fx/base.html" title="S2.FX.Base (class)">S2.FX.Base</a></code></pre>

  
  
  
    
      <ul class="argument-list">
        
          <li>
            <code>element</code>
            
              (<code><a href="../../../scripty2 core/object.html" title="Object (class)">Object</a></code> | <code>String</code>)
            
             &ndash; DOM element or element ID
          </li>
        
          <li>
            <code>options</code>
            
              (<code><a href="../../../scripty2 core/number.html" title="Number (class)">Number</a></code> | <code><a href="../../../scripty2 core/function.html" title="Function (class)">Function</a></code> | <code><a href="../../../scripty2 core/object.html" title="Object (class)">Object</a></code>)
            
             &ndash; options for the effect.
          </li>
        
      </ul>
    
  
  
  <p>Starts playing the element effect. The optional <code>element</code> argument can
be used to reuse this instance on a different element than for
which it was used originally.</p>

  
  
  
  
</li>

        </ul>
      </div>
    </div>
  

      </div>

      <div id="footer">
        <div class="about clearfix">
          <div class="copyright clearfix">
            <div class="copyright-about">
              This work is licensed under a<br/>
              <a rel="license" href="http://creativecommons.org/licenses/by-sa/3.0/">Creative Commons Attribution-Share Alike 3.0 Unported License</a>.<br/>
            </div>
          </div>
          <div class="credits">
            <p>
              Generated by <a href="http://pdoc.org">PDoc</a>.
              Icons by <a href="http://froodee.at/">Samo</a>.
            </p>
            <p>
              Copyright © 2005-2010 <a href="http://mir.aculo.us/">Thomas Fuchs</a>.
            </p>
          </div>
        </div>
      </div>
    </div>

    <script type="text/javascript" src="../../../javascripts/prototype.js" charset="utf-8"></script>
<script type="text/javascript" src="../../../javascripts/s2.js" charset="utf-8"></script>
    <script type="text/javascript" src="../../../javascripts/application.js" charset="utf-8"></script>
    <script type="text/javascript" src="../../../javascripts/item_index.js" charset="utf-8"></script>
    <script type="text/javascript">PDoc.pathPrefix = '../../../';</script>
  </body>
</html>
